/* 登录功能 */
document.querySelector('#btn-login').addEventListener('click',async ()=>{
    // console.log(123);
    //1. 收集并校验数据 从register里面复制过来 修改元素类名
    const {username,password} = serialize(document.querySelector('.login-form'),{hash:true,empty:true});
    console.log(username,password);
    if(username.length===0||password.length===0){
        showToast('用户名或密码不能为空')
        return;
    }
    if(username.length>30||username.length<8||password.length<6||password.length>30){
        showToast('用户名或密码格式有误');
        return;
    }
    //2. 提交数据 （简化方法）
    try{
        //需要被执行的代码
        const res= await axios.post('/login',{username,password});
        console.log(res);
        //这是之前的用法
        // showToast(res.data.message);
        //这是剥离数据后的用法
        showToast(res.message);

        //3.缓存响应数据
        // console.log(res.data.data);
        //因为username变量命名冲突了 所以使用别名重新命名为newUsername
        //这是之前的用法
        // const {token,username:newUsername}=res.data.data;
        //这是剥离数据后的用法
        const {token,username:newUsername}=res.data;
        console.log(token,newUsername);
        //缓存 token及username
        localStorage.setItem('token',token);
        localStorage.setItem('username',newUsername);
        
        //4. 跳转首页 这里的相对路径不是js而是login.html
        // 为了让用户能看到提示，所以加个定时器先等1500毫秒然后再跳转
        setTimeout(()=>{
            location.href='index.html';
            // location.href='./index.html' 同上可以达到相同效果
        },1500)

    }catch (error){
        //捕获错误
        console.dir(error)
        showToast(error.response.data.message)
    }

})

